@rem:75rem;

//首页
.index{
    article{
        
        .a-list{
            padding: 20/@rem 16/@rem;
            box-sizing: border-box;
            li{
                margin: 18/@rem 14/@rem;
                width: 330/@rem;
                height: 218/@rem;
                float: left;
                img{
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
}
/*xwkc*/
.service_xwkc{
    .sersc_1{
        box-sizing: border-box;
        width:100%;
        height:4.666666667rem;
        margin:0 auto;
    }
    .sersc_1 div img{
        width:100%;
        height:100%;
        box-sizing: border-box;
    }
}
/*xwkc-d*/



//诚邀合作
.cooperation{
    .cooperation_top{
        width: 100%;
        height: 350/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .cooperation_title1{
        margin-bottom: 30/@rem;
    }
    .cooperation_middle{
        width: 100%;
        height: 200/@rem;
        margin: 38/@rem 0;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .cooperation_bottom{
        width: 100%;
        height: 200/@rem;
        margin-top: 38/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .roll_wrap1{
        height:310/@rem;
        margin:0;
        .roll_main li{
            width:360/@rem;
            img{
                width: 100%;
                height: 260/@rem;
            }
            p{
                width: 100%;
                height: 50/@rem;
                line-height: 22/@rem;
                padding-top: 16/@rem;
                box-sizing: border-box;
                font-size: 22/@rem;
                color: #fff;
                text-align: center;
                background-color: #939393;
            }
        }
    }
    .roll_wrap2{
        height:230/@rem;
        margin:0;
        .roll_main li{
            width:330/@rem;
        }
    }
    
}


//视频播放
.video_alert{
    z-index: 1000;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    .bg{
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,1);
    }
}
.iphone_video{
    display: none;
    position: relative !important;
    z-index: 8;
}
.video_play{
    position: absolute !important;
    height: auto;
    font-size: 0;
    width: 100%;
    video{
        display: block;
        background-color: #000;
    }
    
}
.null_play_wrap{
    position: relative;
    .null_play{
        width: 100%;
        height: 356/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
}


//开课信息
.school_begins{
    .list{
        padding: 0 30/@rem;
        box-sizing: border-box;
        .brief,.brief_1{
            position: relative;
            margin-top: 8/@rem;
            height: auto;
            font-size: 0;
            img{
                font-size: 0;
                display: block;
                position: absolute;
                left: 20/@rem;
                top: 50%;
                margin-top: -130/@rem;
                width: 303/@rem;
                height: 259/@rem;
            }
            div{
                margin-left: 340/@rem;
                width: 340/@rem;
                p{
                    font-size: 22/@rem;
                    line-height: 38/@rem;
                    color: #666666;
                }
            }
        }
        .brief_1{
            
            img{
                width: 278/@rem;
                height: 259/@rem;
            }
            
        }
        .contact_information{
            margin-top: 16/@rem;
            padding-bottom: 30/@rem;
            box-sizing: border-box;
            border-bottom: dashed 1px #b9b9b9;
            margin-bottom: 4/@rem;
        }
        .more,.more:visited{
            border-radius: 6/@rem;
            margin: 10/@rem auto 26/@rem auto;
            display: block;
            width: 116/@rem;
            height: 44/@rem;
            line-height: 44/@rem;
            text-align: center;
            background-color: #f2f2f2;
            border: solid 1px #cbcbcb;
            color: #666666;
            font-size: 20/@rem;
        }
    }
    .title{
        text-align: center;
        font-size: 26/@rem;
        line-height: 82/@rem;
        font-weight: bold;
        margin-bottom: 10/@rem;
        color: #333333;
    }
}

//app开发
.app{
    .app_top{
        width: 100%;
        height: 120/@rem;
        background-image: url(../images/app_top.png);
        background-size: cover;
        padding-top: 28/@rem;
        box-sizing: border-box;
        div{
            margin: auto;           
            width: 176/@rem;
            height: 64/@rem;
            line-height: 64/@rem;
            font-size: 24/@rem;
            text-align: center;
            color: #fff;
            background-color: rgba(0,0,0,0.6);
        }
    }
    .app_list{
        padding: 30/@rem;
        box-sizing: border-box;
        text-align: center;
        h1{
            font-size: 30/@rem;
            line-height: 30/@rem;
            height: 30/@rem;
            margin-bottom: 8/@rem;
        }
        h2{
            font-size: 20/@rem;
            line-height: 20/@rem;
            height: 20/@rem;
            text-transform: uppercase;
            margin-bottom: 8/@rem;
        }
        p{
            height: 108/@rem;
            font-size: 22/@rem;
            line-height: 36/@rem;
        }
        img{
            width: 100%;
            height: auto;
        }
    }
    .app_list1{
        h1{
            color: #1a95d4;
        }
        h2{
            color: #1a95d4;
        }
        p{
            color: #666666;
            
        }
        img{
            margin-top: 40/@rem;
        }
    }
    .app_list2{
        width: 100%;
        height: 1728/@rem;
        background-image: url(../images/app_img2.png);
        background-size: cover;
        h1{
            color: #ffcc27;
        }
        h2{
            color: #ffcc27;
        }
        p{
            color: #fff;
        }
        img{
            margin-top: 26/@rem;
            width: 100%;
            height: auto;
        }
    }
    .app_list3{
        h1{
            color: #4fb000;
        }
        h2{
            color: #4fb000;
        }
        p{
            color: #666666;
        }
        img{
            margin-top: 40/@rem;
            width: 100%;
            height: auto;
        }
    }
    .app_list4{
        background-color: #f4f4f4;
        h1{
            color: #d8487e;
        }
        h2{
            color: #d8487e;
        }
        p{
            color: #777777;
        }
        .swiper-container{
            font-size: 0;
            margin-bottom: 10/@rem;
        }
        .img{
            width: 335/@rem;
            height: 342/@rem;
            img{
                width: 100%;
                height: 268/@rem;
            }
            p{
                font-size: 26/@rem;
                width: 100%;
                line-height: 74/@rem;
                height: 74/@rem;
                background-color: #fff;
                color: #333333;
            }
        }
    }
}

//家庭教育
.famili_education{
    .cooperation_title{
        margin-bottom: 30/@rem;
    }
    .swiper-container{
        height: 312/@rem;
        .swiper-button-prev{
            left: 26/@rem;            
        }
        .swiper-button-next{
            right: 26/@rem;               
        }
    }
    .big_course{
        position: relative;
        margin-top: 30/@rem;
        width: 100%;
        height: 280/@rem;
        div{
            position: absolute;
            top: 94/@rem;
            left: 246/@rem;
            width: 258/@rem;
            height: 92/@rem;
            background-color: rgba(0,0,0,0.5);
            box-sizing: border-box;
            text-align: center;
            padding-top: 24/@rem;
            h1{
                font-size: 24/@rem;
                line-height: 24/@rem;
                height: 24/@rem;
                margin-bottom: 8/@rem;
                color: #fff;
            }
            h2{
                font-size: 14/@rem;
                line-height: 14/@rem;
                height: 14/@rem;
                color: #fff;
                text-transform: uppercase;
            }
        }
    }
    .video_course{
        background-image: url(../images/jtb_2.png);
        background-size: cover;
    }
    .parents_message{
        background-image: url(../images/jtb_3.png);
        background-size: cover;
    }
    .wonderful_course{
        background-image: url(../images/jtb_5.png);
        background-size: cover;
    }
    .course_list{
        ul{
            padding: 0 0 0 14/@rem;
            box-sizing: border-box;
            li{
                float: left;
                width: 330/@rem;
                margin: 0 16/@rem;
                font-size: 0;
                img{
                    width: 100%;
                    height: 240/@rem;
                }
                p{
                    width: 100%;
                    height: 52/@rem;
                    line-height: 52/@rem;
                    font-size: 22/@rem;
                    color: #fff;
                    text-align: center;
                    background-color: #939393;
                }
            }
        }
        .course_list_now{
            li{
                margin-bottom: 30/@rem;
            }
        }
        .more,.more:visited{
            text-align: center;
            display: block;
            margin: auto;
            border-radius: 6/@rem;
            width: 108/@rem;
            height: 48/@rem;
            line-height: 48/@rem;
            color: #fff;
            background-color: #1a95d4;
            font-size: 22/@rem;
        }
    }
    .parents_share{
        font-size: 24/@rem;
        color: #666666;
        li{
            padding: 0 40/@rem;
            box-sizing: border-box;
            border-bottom: dashed 1px #333333;
            margin-bottom: 24/@rem;
            padding-bottom: 20/@rem;
        }
        p{              
            text-indent: 48/@rem;
            line-height: 36/@rem;
            max-height: 100000px;
            
        }
        p:last-of-type{
            text-align: right;
            
        }
        li:last-of-type{
            border: none;
        }
    }
    .roll_wrap2{
        height:230/@rem;
        margin: 40/@rem 0;
        .roll_main li{
            width:330/@rem;
        }
    }
}
//技术支持
.tech{
    .tec_ban{
        width:100%;
        height: 243/@rem;
        background: url(../images/tec_banner.png)50% no-repeat ;
        box-sizing: border-box;
        background-size: cover;
    }
    .tec_con {
        width: 100%;
        height: 470/@rem;
        background:url(../images/tec_con.png) 50% no-repeat;
        background-size: cover
    }
   .tec_cont{
       overflow: hidden;
       width: 750/@rem;
       margin-top: 50/@rem;
       a{
          float: left;
          width: 160/@rem;
          height: 220/@rem;
          font-size: 20/@rem;
          line-height: 32/@rem;
          text-align: center;
          margin-left: 70/@rem;
          color: #333333;
          img{
            width: 160/@rem;
            height: 160/@rem;
          }
       }
   }
   .tec_conbo{
       overflow: hidden;
       width: 750/@rem;
       margin-top: 20/@rem;
       a{
          float: left;
          width: 160/@rem;
          height: 220/@rem;
          font-size: 20/@rem;
          line-height: 32/@rem;
          text-align: center;
          margin-left: 70/@rem;
          color: #333333;
          img{
            width: 160/@rem;
            height: 160/@rem;
          }
       }
       .zx{
           margin-left: 180/@rem;
       }      
   }
}

//智能化管理
.znh{
    .zn1{
        width:100%;
        height: 120/@rem;
        text-align: center;       
        padding-top: 28/@rem;
        box-sizing: border-box;
        background: url(../images/znh_1.png) 50% no-repeat;
        background-size: cover;
        div{
            margin: auto;           
            width: 176/@rem;
            height: 64/@rem;
            line-height: 64/@rem;
            font-size: 24/@rem;
            color: #fff;
            background-color: rgba(0,0,0,0.6);
        }
    }
    .znhtop{
        padding: 30/@rem;
        box-sizing: border-box;
        text-align: center;
        h1{
            font-size: 30/@rem;
            line-height: 30/@rem;
            height: 30/@rem;
            margin-bottom: 8/@rem;
        }
        h2{
            font-size: 20/@rem;
            line-height: 20/@rem;
            height: 20/@rem;
            text-transform: uppercase;
            margin-bottom: 8/@rem;
        }
        p{
            height: 108/@rem;
            font-size: 22/@rem;
            line-height: 36/@rem;
        }
        h1{
            color: #1a95d4;
        }
        h2{
            color: #1a95d4;
        }
        p{
            color: #666666;
            
        }
    }
    .znhtop1{
        h1{
            color: #1a95d4;
        }
        h2{
            color: #1a95d4;
        }
        p{
            color: #666666;
            
        }
    }
    .znhtop2{
        width: 100%;
        height: 840/@rem;
        background-image: url(../images/znh_8.png);
        background-size: cover;
        h1{
            color: #ffcc27;
        }
        h2{
            color: #ffcc27;
        }
        p{
            color: #fff;
        }
        img{
            margin-top: 26/@rem;
            width: 100%;
            height: auto;
        }
    }
    .znhtop3{
        ul{
            width: 100%;
            overflow: hidden;
            margin: auto;
            text-align: center;
            box-sizing: border-box;
            h4{
                font-size: 20/@rem;
                color: #333333;
            }
            p{
                font-size: 16/@rem;
                color: #666666;
            }
        }
        li{
            width: 50%;
            float: left;
            margin: 20/@rem auto;
            text-align: center;;
            padding-top: 145/@rem;
            background: url(../images/znh_13.png) 50% 0 no-repeat;
        }
        .tp32{
            background: url(../images/znh_14.png) 50% 0 no-repeat;
        }
        .tp33{
            background: url(../images/znh_15.png) 50% 0 no-repeat;
        }
        .tp34{
            background: url(../images/znh_16.png) 50% 0 no-repeat;
        }
        .tp35{
            background: url(../images/znh_17.png) 50% 0 no-repeat;
        }
        .tp36{
            background: url(../images/znh_18.png) 50% 0 no-repeat;
        }
    }
    .znh2 {
        padding:0 30/@rem;
        box-sizing: border-box;
        li{
            margin-bottom: 30/@rem;
        }
        h4{
                font-size: 14/@rem;
                line-height: 45/@rem;
                color: #222222;
            }
        p{
            font-size: 12/@rem;
            color: #666666 ;
            line-height: 33/@rem;
        }
        .znh2_1{
            margin-top: 30/@rem;
            padding-left: 190/@rem;
            background: url(../images/znh_2.png) 0 center no-repeat;
            text-align: left;   
        }
        .znh2_2{
            padding-right: 210/@rem;
            background: url(../images/znh_3.png) 480/@rem center no-repeat;
            text-align: right;   
        }
        .znh2_3{
            padding-left: 180/@rem;
            background: url(../images/znh_4.png) 0 center no-repeat;
            text-align: left; 
        }
        .znh2_4{
            padding-right: 210/@rem;
            background: url(../images/znh_5.png) 480/@rem center no-repeat;
            text-align: right;   
        }
        .znh2_5{
            padding-left: 180/@rem;
            background: url(../images/znh_6.png) 0 center no-repeat;
            text-align: left;   
        }
        .znh2_6{
            padding-right: 210/@rem;
            background: url(../images/znh_7.png) 480/@rem center no-repeat;
            text-align: right;   
        }
    }   
}
//读书会
.read{
    width: 100%;
    height: 350/@rem;
    .title{
        text-align: center;
        font-size: 26/@rem;
        line-height: 82/@rem;
        height: 82/@rem;
        font-weight: bold;
        margin-bottom: 10/@rem;
        color: #333333;
    }
    .list_mess p span:last-of-type{
        width: 560/@rem;
    }
    .roll_wrap{
        height: 305/@rem;
        margin: 30/@rem 0 40/@rem 0;
        li{
            width: 240/@rem;
            height: 305/@rem;
            a{
                display: block;
                width: 100%;
                height: 100%;
                img{
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
    .contact_information2{
        padding-bottom: 30/@rem;
        box-sizing: border-box;
        padding-left: 40/@rem;
    }
    .roll_wrap2{
        height: 414/@rem;
        margin: 30/@rem 0 40/@rem 0;
        li{
            width: 310/@rem;
            height: 414/@rem;
            a{
                display: block;
                width: 100%;
                height: 100%;
                img{
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
}

//海淀更多
.school_begins_more{
    .list_bg{
        margin-bottom: 0;
    }
    .roll_wrap2{
        height: 435/@rem;
        margin: 40/@rem 0 0/@rem 0;
        li{
            width: 314/@rem;
            height: 395/@rem;
            a{
                display: block;
                width: 100%;
                height: 100%;
                img{
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
    .contact_information{
        border: none;
    }
    .brief_list{
        padding-bottom: 40/@rem;
        box-sizing: border-box;
    }
    .brief{
        position: relative;
        margin-top: 20/@rem;
        height: auto;
        font-size: 0;
        img{
            font-size: 0;
            display: block;
            position: absolute;
            left: 20/@rem;
            top: 50%;
            margin-top: -130/@rem;
            width: 303/@rem;
            height: 259/@rem;
        }
        .name{
            position: absolute;
            bottom: -20/@rem;
            width: 303/@rem;
            text-align: center;
            left: 20/@rem;
            font-size: 22/@rem;
            line-height: 22/@rem;
            color: #666666;
        }
        .brief_right{
            text-align: left;
            margin-left: 340/@rem;
            width: 340/@rem;
            p{
                font-size: 22/@rem;
                line-height: 38/@rem;
                color: #666666;
            }
        }
    }
}


//公微建设
.wexin{
    .app_top{
        width: 100%;
        height: 120/@rem;
        background-image: url(../images/w_1.png);
        background-size: cover;
        padding-top: 28/@rem;
        box-sizing: border-box;
        div{
            margin: auto;           
            width: 176/@rem;
            height: 64/@rem;
            line-height: 64/@rem;
            font-size: 24/@rem;
            text-align: center;
            color: #fff;
            background-color: rgba(0,0,0,0.6);
        }
    }
    .top_mess{
        padding: 24/@rem 48/@rem 0 48/@rem;
        box-sizing: border-box;
        text-align: center;
        font-size: 22/@rem;
        line-height: 34/@rem;
        color: #666666;
    }
    .app_list{
        padding: 30/@rem;
        box-sizing: border-box;
        text-align: center;
        h1{
            font-size: 30/@rem;
            line-height: 30/@rem;
            height: 30/@rem;
            margin-bottom: 8/@rem;
        }
        h2{
            font-size: 20/@rem;
            line-height: 20/@rem;
            height: 20/@rem;
            text-transform: uppercase;
            margin-bottom: 8/@rem;
        }
        img{
            width: 100%;
            height: auto;
        }
    }
    .app_list1{
        h1{
            color: #1a95d4;
        }
        h2{
            color: #1a95d4;
        }
        p{
            color: #666666;
            
        }
        img{
            margin-top: 40/@rem;
        }
    }
    .app_list2{
        padding-bottom: 0;
        width: 100%;
        background: url(../images/w_3.png) no-repeat center center;
        background-size: 351/@rem 362/@rem;
        h1{
            color: #ffcc27;
        }
        h2{
            color: #ffcc27;
        }
        ul{
            margin-top: 20/@rem;
            text-align: left;
            font-size: 22/@rem;
            line-height: 22/@rem;
            color: #555555;
            h5{
                font-size: 22/@rem;
                line-height: 34/@rem;
                height: 34/@rem;
                color: #ffae00;
                em{
                    display: inline-block;
                    vertical-align: middle;
                    background-color: #ffae00;
                    border-radius: 50%;
                    width: 10/@rem;
                    height: 10/@rem;
                    margin-right: 12/@rem;
                }
            }
            p{
                height: 22/@rem;
                padding-left: 22/@rem;
                margin-bottom: 30/@rem;
            }
            li{
                margin-left: 40/@rem;
            }
        }
    }
    .app_list4{
        width: 100%;
        height: 600/@rem;
        background-image: url(../images/w_2.png);
        background-size: cover;
        h1{
            color: #d8487e;
        }
        h2{
            color: #d8487e;
        }
    }
}

//关于我们
.about_us{
    .roll_wrap2{
        margin: 30/@rem 0 0/@rem 0;
        .roll_main li{
            width: 330/@rem;
            height: 230/@rem;
        }
    }
    .intro{
        width: 100%;
        text-align: center;
        padding: 26/@rem 10/@rem 30/@rem 26/@rem;
        box-sizing: border-box;
        max-height: 10000px;
        line-height: 36/@rem;
        font-size: 24/@rem;
        color: #666666;
        p{
            margin-bottom: 30/@rem;
            text-align: left;
        }
        img{
            width: 440/@rem;
            height: 230/@rem;
        }
    }
    .cooperation_titl2{
        background-image: url(../images/about_img4.jpg);
        background-size: cover;
        width: 100%;
        height: 350/@rem;
        h1{
            color: #fff;
        }
        h2{
            color: #fff;
        }
        h3{
            font-size: 30/@rem;
            line-height: 76/@rem;
            color: #f7a618;
        }
        ul{
            li{
                padding-left: 110/@rem;
                box-sizing: border-box;
                text-align: left;
                font-size: 20/@rem;
                color: #fff;
                line-height: 48/@rem;
                em{
                    display: inline-block;
                    width: 16/@rem;
                    height: 16/@rem;
                    box-sizing: border-box;
                    border-radius: 50%;
                    background-color: #fff;
                    margin-right: 12/@rem;
                }
            }
        }
    }
    .ab_ad{
        li{
            display: block;
            width: 50%;
            height: 272/@rem;
            padding-top: 248/@rem;
            box-sizing: border-box;
            float: left;
            font-size: 22/@rem;
            line-height: 22/@rem;
            color: #666666;
        }
        li:first-of-type{
            background:url(../images/ab_ad_1.jpg) no-repeat center 30/@rem;
            background-size: 200/@rem;
        }
        li:nth-of-type(2){
            background:url(../images/ab_ad_2.jpg) no-repeat center 30/@rem;
            background-size: 200/@rem;
        }
        li:nth-of-type(3){
            background:url(../images/ab_ad_3.jpg) no-repeat center 30/@rem;
            background-size: 200/@rem;
        }
        li:nth-of-type(4){
            background:url(../images/ab_ad_4.jpg) no-repeat center 30/@rem;
            background-size: 200/@rem;
        }
    }
    .cooperation_title1{
        font-size: 0;
        img{
            width: 100%;
            height: 549/@rem;
            margin: 20/@rem 0 10/@rem 0;
        }
    }
}
//先锋营
.pioneer{
    .intro{
        padding: 28/@rem 30/@rem 30/@rem 30/@rem;
        box-sizing: border-box;
        p{
            max-height: 1000px;
            font-size: 22/@rem;
            line-height: 34/@rem;
            color: #666666;
            text-indent: 26/@rem;
            em{
                display: inline-block;
                vertical-align: middle;
                width: 6/@rem;
                height: 6/@rem;
                box-sizing: border-box;
                border-radius: 50%;
                margin-right: 12/@rem;
                background-color: #666666;
            }
        }
    }
    .pion_video{
        padding: 0 75/@rem;
        box-sizing: border-box;
        margin-bottom: 40/@rem;
    }
    .img_list{
        padding: 24/@rem 0 0 5/@rem;
        box-sizing: border-box;
        li{
            float: left;
            width: 320/@rem;
            margin: 0 25/@rem;
            font-size: 0;
            text-align: center;
            margin-bottom: 36/@rem;
            img{
                width: 100%;
                height: 240/@rem;
            }
        }
    }
    .list_bg{
        margin-bottom: 0;
    }
    .cooperation_title1{
        width: 100%;
        height: 1921/@rem;
        background-image: url(../images/pion_2.jpg);
        background-size: cover;
        h1,h2{
            color: #fff;
        }
    }
    .pion_bg{
        width: 100%;
        height: 1526;
        background-image: url(../images/pion_3.jpg);
        background-size: cover;
        .cooperation_title{
            h1,h2{
                color: #fff;
            }
            .img_list{
                padding: 24/@rem 0 0 23/@rem;
                box-sizing: border-box;
                p{
                    color: #fff;
                }
                li{
                    float: left;
                    width: 320/@rem;
                    margin: 0 16/@rem;
                    font-size: 0;
                    text-align: center;
                    margin-bottom: 0;
                    img{
                        width: 100%;
                        height: 240/@rem;
                    }
                }
            }
        }
        .cooperation_title:last-of-type{
            li{
                margin-bottom: 36/@rem;
            }
        }
    }
    .roll_wrap{
        margin: 30/@rem 0 40/@rem 0;
        .roll_main li{
            width: 320/@rem;
            height: 240/@rem;
        }
    }
    .course{
       text-align: left;
       font-size: 22/@rem;
       color: #666666; 
       h6{
           margin-left: 32/@rem;
           font-size: 22/@rem;
           color: #666666; 
           em{
               color: #1a95d4;
           }
       }
       p{
           margin-left: 56/@rem;
           text-indent: 22/@rem;
           
       }
    }
    .course_middle{
        p{
            text-indent: 0;
            margin-left: 78/@rem;
        }
    }
    .pion_courselist{
        margin-bottom: 40/@rem;
        li{
            margin: 30/@rem auto 0/@rem auto;
            width: 514/@rem;
            height: 158/@rem;
            h5{
                margin-left: 14/@rem;
                font-size: 24/@rem;
                line-height: 68/@rem;
                color: #fff;
            }
            p{
                margin-left: 44/@rem;
                margin-right: 50/@rem;
                font-size: 22/@rem;
                line-height: 30/@rem;
                color: #fff;
                text-indent: 0;
            }
        }
        li:first-of-type{
            background-image: url(../images/pion_coursey.png);
            background-size: cover;
        }
        li:nth-of-type(2){
            background-image: url(../images/pion_courseg.png);
            background-size: cover;
        }
        li:last-of-type{
            background-image: url(../images/pion_courser.png);
            background-size: cover;
        }
    }
}


//网站设计
.web{
    .web_top{
        width: 100%;
        height: 120/@rem;
        background-image: url(../images/app_top.png);
        background-size: cover;
        padding-top: 28/@rem;
        box-sizing: border-box;
        div{
            margin: auto;           
            width: 176/@rem;
            height: 64/@rem;
            line-height: 64/@rem;
            font-size: 24/@rem;
            text-align: center;
            color: #fff;
            background-color: rgba(0,0,0,0.6);
        }
    }
    .web_img{
        width: 100%;
        height: 690/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .cooperation_title{
        margin-top: 20/@rem;
        h1{
            font-size: 30/@rem;
            line-height: 30/@rem;
            height: 30/@rem;
            color: #eb709e;
            font-weight: bold;
        }
        h2{
            font-size: 20/@rem;
            color: #999;
        }
    }
    table{
        width: 690/@rem;
        margin: 40/@rem auto;
        height: ;
        tr{
            width: 100%;
            line-height: 60/@rem;
            text-align: center;
            font-size: 22/@rem;
            color: #777777;
            td:last-of-type,th:last-of-type{
                width: 154/@rem;
                border-right: none;
            }
            td:first-of-type,th:first-of-type{
                border-left: none;
            }
            td:first-of-type{
                width: 160/@rem;
            }
            th:first-of-type{
                padding-left: 74/@rem;
                box-sizing: border-box;
                text-align: left;
                background: url(../images/table_th.png) no-repeat 30/@rem center;
                background-size: 24/@rem;
            }
            td:last-of-type{
                color: #1995d1;
            }
            td:nth-of-type(2){
                font-size: 20/@rem;
            }
        }
        tr:first-of-type{
            th{
                border-top: solid 2px #999999;
            }
        }
        tr:last-of-type{
            td{
                border-bottom: solid 2px #999999;
            }
        }
        th,td{
            border-top: solid 1px #999999;
            border-bottom: solid 1px #999999;
            border-right: solid 1px #999999;
            border-left: solid 1px #999999;
        }
        th{
            font-size: 24/@rem;
            font-weight: normal;
        }
        td{
            height: 60/@rem;
            p{
                font-size: 20/@rem;
                margin-top: 2/@rem;
                line-height: 26/@rem;
            }
        }
    }
}
//校园培训
.train{
    .roll_wrap2{
        height:230/@rem;
        margin: 40/@rem 0;
        .roll_main li{
            width:330/@rem;
        }
    }
    .emotional{
        width: 690/@rem;
        height: 155/@rem;
        margin: 18/@rem auto;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .train_p{
        padding: 0 30/@rem 30/@rem 36/@rem;
        box-sizing: border-box;
        max-height: 10000px;
        font-size: 24/@rem;
        line-height: 36/@rem;
        color: #666666;
        text-align: left;
        em{
            color: #1a95d4;
        }
    }
    .train_p1{
        height: 246/@rem;
    }
    .train_p2{
        height: 312/@rem;
        padding: 30/@rem 24/@rem ;
    }
    .train_p3{
        height: 266/@rem;
    }
    .classroom{
        padding-bottom: 30/@rem;
        margin: 0 30/@rem;
        border-bottom: dashed 1px #959595;
        font-size: 0;
        img{
            width: 440/@rem;
            height: 320/@rem;
            margin: auto;
        }
    }
    .list_bg{
        margin-bottom: 0;
    }
    .img_list{
        li{
            width: 296/@rem;
            margin-bottom: 30/@rem;
            img{
                height: 292/@rem;
            }
            p{
                margin-top: 10/@rem;
            }
        }
    }
    .sel{
        width: 100%;
        height: 878/@rem;
        background-image: url(../images/xyb_3.png);
        background-size: cover;
        h1{
            font-size: 26/@rem;
            line-height: 82/@rem;
            color: #fff;
            text-align: center;
        }
        li{
            font-size: 0;
            color: #fff;
            padding: 0 0/@rem 0 30/@rem;
            box-sizing: border-box;
            margin-bottom: 30/@rem;
            em{
                display: inline-block;
                width: 184/@rem;
                color: #51c7ff;
                font-size: 22/@rem;
                float: left;
                text-align: right;
            }
            span{
                display: inline-block;
                float: left;
                width: 504/@rem;
                font-size: 22/@rem;
            }
        }
        img{
            display: block;
            width: 705/@rem;
            height: 380/@rem;
            margin: auto;
        }
    }
    .set_course_list{
        padding-top: 30/@rem;
        box-sizing: border-box;
        li{
            margin: auto;
            width: 640/@rem;
            height: 140/@rem;
            margin-bottom: 40/@rem;
        }
        .set_course_list_title{
            padding-top: 16/@rem;
            box-sizing: border-box;
            text-align: center;
            width: 220/@rem;
            h5{
                font-size: 22/@rem;
                line-height: 66/@rem;
                height: 66/@rem;
                color: #fff;
            }
            p{
                font-size: 14/@rem;
                line-height: 14/@rem;
                height: 14/@rem;
                color: #fff;
                text-transform: uppercase;
            }
        }
        .set_course_list_content{
            text-align: left;
            p{
                width: 330/@rem;
                margin-left: 12/@rem;
                margin-top: 12/@rem;
                box-sizing: border-box;
                font-size: 18/@rem;
                line-height: 24/@rem;
                max-height: 10000px;
                color: #666666;
                em{
                    display: block;
                    font-size: 16/@rem;
                    line-height: 18/@rem;
                    height: 18/@rem;
                }
            }
            p:first-of-type{
                height: 72/@rem;
            }
        }
        li:nth-of-type(1){
            background-image: url(../images/kais_1.png);
            background-size: cover;
            .set_course_list_title{
                float: right;
            }
            .set_course_list_content{
                float: left;
                p{
                    em{
                        color: #c84022;
                    }
                }
            }
        }
        li:nth-of-type(2){
            background-image: url(../images/kais_2.png);
            background-size: cover;
            .set_course_list_title{
                float: left;
            }
            .set_course_list_content{
                float: right;
                p{
                    em{
                        color: #d46908;
                        margin-left: 190/@rem;
                    }
                }
            }
        }
        li:nth-of-type(3){
            background-image: url(../images/kais_3.png);
            background-size: cover;
            .set_course_list_title{
                float: right;
            }
            .set_course_list_content{
                float: left;
                p{
                    em{
                        color: #346d86;
                    }
                }
            }
        }
        li:nth-of-type(4){
            background-image: url(../images/kais_4.png);
            background-size: cover;
            .set_course_list_title{
                float: left;
            }
            .set_course_list_content{
                float: right;
                p{
                    em{
                        margin-top: 30/@rem;
                        color: #97a11b;
                        margin-left: 190/@rem;
                    }
                }
            }
        }
    }
    .teach_class_list{
        padding: 36/@rem 0 0 18/@rem;
        box-sizing: border-box;
        li{   
            padding:20/@rem 0 0 0;
            box-sizing: border-box;        
            float: left;
            text-align: left;
            width: 330/@rem;
            height: 310/@rem;
            background-color: #fff;
            border-radius: 12/@rem;
            margin: 0 14/@rem 40/@rem 14/@rem;
            h5{
                font-size: 22/@rem;
                line-height: 40/@rem;
                height: 40/@rem;
                color: #fff;
            }
            .teach_class_list_top{
                padding: 8/@rem 16/@rem 0 36/@rem;
                box-sizing: border-box;
                width: 100%;
                height: 90/@rem;
                background-color: ;
                p{
                    font-size: 14/@rem;
                    line-height: 16/@rem;
                    max-height: 1000px;
                    color: #fff;
                    text-transform: uppercase;
                }
            }
            .teach_class_list_middle{
                height: 150/@rem;
                padding: 0 16/@rem;
                box-sizing: border-box;
                font-size: 18/@rem;
                line-height: 24/@rem;
                max-height: 100000/@rem;
                color: #666666;
                display: box;           
                 display: -webkit-box;     
                 display: -moz-box;      
                 display: -ms-flexbox;     
                 display: -webkit-flex;   
                 display: flex;           
                 -webkit-box-orient: horizontal;
                 -webkit-flex-direction: row;
                 -moz-flex-direction: row; 
                 -ms-flex-direction: row;
                 -o-flex-direction: row;
                 flex-direction: row;
                -webkit-box-pack: space-between;
                -webkit-justify-content: space-between;
                -moz-justify-content: space-between;
                -o-justify-content: space-between;
                -ms-justify-content: space-between;
                justify-content: space-between;
                -webkit-flex-wrap: nowrap;
                -moz-flex-wrap: nowrap;
                -ms-flex-wrap: nowrap;
                -o-flex-wrap: nowrap;
                flex-wrap: nowrap;
                -webkit-align-items: center;
                -moz-align-items: center;
                -ms-align-items: center;
                -o-align-items: center;
                align-items: center;
                p{
                    width: 100%;
                    height: auto;
                }
            }
            .teach_class_list_bottom{
                padding: 0 16/@rem;
                box-sizing: border-box;
                font-size: 16/@rem;
                line-height: 20/@rem;
                height: 24/@rem;
            }
        }
        li:nth-of-type(1){
            .teach_class_list_top{
                background-color: #16679a;
            }
            .teach_class_list_bottom{
                color: #16679a;
            }
        }
        li:nth-of-type(2){
            .teach_class_list_top{
                background-color: #ff4a52;
            }
            .teach_class_list_bottom{
                color: #ff4a52;
                float: right;
            }
        }
        li:nth-of-type(3){
            .teach_class_list_top{
                background-color: #ff9b00;
            }
            .teach_class_list_bottom{
                color: #ff9b00;
            }
        }
        li:nth-of-type(4){
            .teach_class_list_top{
                background-color: #6cb015;
            }
            .teach_class_list_bottom{
                color: #6cb015;
                float: right;
            }
        }
        li:nth-of-type(5){
            .teach_class_list_top{
                background-color: #ff4a52;
            }
            .teach_class_list_bottom{
                color: #ff4a52;
            }
        }
        li:nth-of-type(6){
            .teach_class_list_top{
                background-color: #ff9b00;
            }
            .teach_class_list_bottom{
                color: #ff9b00;
                float: right;
            }
        }
        li:nth-of-type(7){
            .teach_class_list_top{
                background-color: #6cb015;
            }
            .teach_class_list_bottom{
                color: #6cb015;
            }
        }
        li:nth-of-type(8){
            .teach_class_list_top{
                background-color: #16679a;
            }
            .teach_class_list_bottom{
                color: #16679a;
                float: right;
            }
        }
    }
}
//在线推广
.online_promotion{
    .app_top{
        width: 100%;
        height: 120/@rem;
        background-image: url(../images/znh_1.png);
        background-size: cover;
        padding-top: 28/@rem;
        box-sizing: border-box;
        div{
            margin: auto;           
            width: 176/@rem;
            height: 64/@rem;
            line-height: 64/@rem;
            font-size: 24/@rem;
            text-align: center;
            color: #fff;
            background-color: rgba(0,0,0,0.6);
        }
    }
    .app_list{
//      padding: 30/@rem 0 0 0;
        box-sizing: border-box;
        text-align: center;
        h1{
            font-size: 30/@rem;
            line-height: 30/@rem;
            height: 30/@rem;
            margin-bottom: 8/@rem;
        }
        h2{
            font-size: 20/@rem;
            line-height: 20/@rem;
            height: 20/@rem;
            text-transform: uppercase;
        }
        
    }
    .app_list1{
        h1{
            color: #1a95d4;
        }
        h2{
            color: #1a95d4;
        }
        
    }
    
    .app_list3{
        padding: 30/@rem 0 0 0;
        h1{
            color: #4fb000;
        }
        h2{
            color: #4fb000;
            margin-bottom: 38/@rem;
        }
    }
    .online_promotion_list{
        h4{
            font-size: 26/@rem;
            line-height: 26/@rem;
            height: 26/@rem;
            color: #333333;
            margin: 0/@rem 0 12/@rem 0;
        }
        p{
            margin: 0 30/@rem;
            text-align: left;
            font-size: 22/@rem;
            line-height: 34/@rem;
            max-height: 10000/@rem;
            color: #666666;
            text-indent: 44/@rem;
        }
        .img{
            margin-top: 30/@rem;
            width: 100%;
            img{
                margin: auto;
                width: 410/@rem;
                height: 387/@rem;
            }
        }
    }
    .online_promotion_list:first-of-type{
        p{
            height: 136/@rem;
        }
    }
    .online_promotion_list:nth-of-type(2){
        p{
            height: 170/@rem;
        }
    }
    .online_promotion_list:last-of-type{
        p{
            height: 102/@rem;
        }
    }
    .img_list{
        padding-left: 15/@rem;
        margin-bottom: 50/@rem;
        li{
            width: 330/@rem;
            margin: 0 15/@rem;
            height: 263/@rem;
            img{
                height: 263/@rem;
            }
        }
    }
    .design_list{
        margin-top: 40/@rem;
        padding:0 30/@rem;
        box-sizing: border-box;
        .design_list_img{
            float: left;
            vertical-align: middle;
            width: 266/@rem;
            height: 160/@rem;
            background: url(../images/online_6.png) no-repeat center center;
            background-size: 160/@rem;
        }
        .design_list_content{
            float: left;
            width: 394/@rem;
            text-align: right;
            h4{
                font-size: 26/@rem;
                line-height: 30/@rem;
                height: 30/@rem;
                color: #333333;
                margin: 0/@rem 0 34/@rem 0;
            }
            p{
                
                font-size: 22/@rem;
                line-height: 34/@rem;
                max-height: 10000px;
                color: #666666;
            }
        }
    }
    .design_list1{
        .design_list_content{
            text-align: left;
        }
        .design_list_img{
            background: url(../images/online_4.png) no-repeat center center;
            background-size: 160/@rem;
        }
    }
    .design_list3{
        .design_list_content{
            text-align: left;
        }
        .design_list_img{
            background: url(../images/online_7.png) no-repeat center center;
            background-size: 160/@rem;
        }
    }
    .design_img1{
        width: 713/@rem;
        height: 393/@rem;
        margin: auto;
        margin-top: 20/@rem;
        margin-bottom: 80/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .design_img2{
        width: 629/@rem;
        height: 461/@rem;
        margin: auto;
        margin-top: 20/@rem;
        margin-bottom: 80/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .design_img3{
        width: 420/@rem;
        height: 146/@rem;
        margin: auto;
        margin-top: 30/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .design_img4{
        width: 612/@rem;
        height: 362/@rem;
        margin: auto;
        margin-top: 30/@rem;
        margin-bottom: 30/@rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
}
//望京更多
.wjye{
    width: 100%;
    margin: 0 auto;
    text-align: center;
    padding: 30/@rem;
    overflow: hidden;
    box-sizing: border-box;
    accelerator: false;
    a{
        width: 50%;
        height: 300/@rem;
        float: left;
        font-size: 20/@rem;
        color: #555555;
        margin-bottom: 20/@rem;
    }
}
.wj .wjm{
    background: #f4f4f4;
}

//login
.login{
    header{
        padding: 0 40/@rem;
        box-sizing: border-box;
        width: 100%;
        height: 108/@rem;
        line-height: 108/@rem;
        img{
            width: 278/@rem;
            height: 60/@rem;
        }
        a,a:visited{
            font-size: 24/@rem;
            color: #666666;
            float: right;
        }
    }
    article{
        width: 100%;
        height: 859/@rem;
        background-image: url(../images/login_bg.png);
        text-align: center;
        position: relative;
        .bg{
            position: absolute;
            top: 20%;
            left: 70/@rem;
            width: 610/@rem;
            padding: 10/@rem;
            box-sizing: border-box;
            background-color: rgba(255,255,255,0.7);
            border: solid 1px #666666;
        }
        form{
            display: inline-block;
            vertical-align: top;
            padding-left: 92/@rem;
            padding-top: 70/@rem;
            padding-bottom: 40/@rem;
            box-sizing: border-box;
            width: 100%;
            line-height: 66/@rem;
            font-size: 0;
            text-align: left;
            border: solid 1px #666666;
            background-color: #fff;
            label{
                display: inline-block;
                vertical-align: middle;
                width: 64/@rem;
                height: 34/@rem;
                line-height: 64/@rem;
                border-right: solid 1px #666666;
                box-sizing: border-box;
            }
            .username_p{
                display: inline-block;
                width: 418/@rem;
                height: 66/@rem;
                line-height: 66/@rem;
                margin: 20/@rem 0;
                font-size: 0;
                border: solid 1px #666666;
                box-sizing: border-box;
                label{
                    background: url(../images/username.png) no-repeat center center;
                    background-size: 27/@rem 25/@rem;
                }
                input{
                    display: inline-block;
                    vertical-align: top;
                    width: 340/@rem;
                    padding-left: 24/@rem;
                    box-sizing: border-box;
                    height: 64/@rem;
                    line-height: 34/@rem;
                    font-size: 22/@rem;
                    color: #666666;
                }
                ::-webkit-input-placeholder { /* WebKit browsers */  
                    color:#888888;  
                }
            }
            .username_error,.pw_error{
                display: none;
                text-align: left;
                font-size: 20/@rem;
                line-height: 26/@rem;
                height: 26/@rem;
                color: #e77171;
                em{
                    display: inline-block;
                    vertical-align: top;
                    margin-top: 3/@rem;
                    margin-right: 10/@rem;
                    width: 20/@rem;
                    height: 20/@rem;
                    background-image: url(../images/error.png);
                    background-size: cover;
                }
            }
            .pw_error{
                margin-bottom: 16/@rem;
            }
            .pw_p{
                display: inline-block;
                width: 418/@rem;
                height: 66/@rem;
                line-height: 66/@rem;
                margin: 20/@rem 0;
                font-size: 0;
                border: solid 1px #666666;
                box-sizing: border-box;
                label{
                    background: url(../images/pw.png) no-repeat center center;
                    background-size: 20/@rem 27/@rem;
                }
                input{
                    display: inline-block;
                    vertical-align: top;
                    width: 340/@rem;
                    padding-left: 24/@rem;
                    box-sizing: border-box;
                    height: 64/@rem;
                    line-height: 34/@rem;
                    font-size: 22/@rem;
                    color: #666666;
                }
                ::-webkit-input-placeholder { /* WebKit browsers */  
                    color:#888888;  
                }
            }
            .p3{
                width: 418/@rem;
                font-size: 20/@rem;
                line-height: 26/@rem;
                height: 26/@rem;
                margin-bottom: 20/@rem;
                span{
                    display: inline-block;
                    vertical-align: top;
                    width: 26/@rem;
                    height: 26/@rem;
                    background: url(../images/checkbox.png) no-repeat;
                    background-size: cover;
                    background-position-x: center;
                    background-position-y: 0;
                }
                .span_active{
                    background: url(../images/checkbox.png) no-repeat;
                    background-size: cover;
                    background-position-x: center;
                    background-position-y: -26/@rem;
                }
                em{
                    float: right;
                }
            }
            #submit{
                width: 418/@rem;
                height: 56/@rem;
                line-height: 56/@rem;
                text-align: center;
                font-size: 24/@rem;
                color: #fff;
                background-color: #1a95d4;
                border-radius: 6/@rem;
            }
            .phone{
                width: 418/@rem;
                line-height: 60/@rem;
                text-align: center;
                font-size: 20/@rem;
                color: #444444;
                a,a:visited{
                    color: #444444;
                }
            }
        }
    }
}
//编辑信息
.me_editor{
    article{
        position: relative;
        .top_img{
            height: 280/@rem;
        }
        .user_img{
            position: absolute;
            top: 172/@rem;
            left: 40/@rem;
            width: 175/@rem;
            height: 175/@rem;
            border: solid 1px #666666;
        }
        h1{
            font-size: 30/@rem;
            line-height: 108/@rem;
            color: #333333;
            padding-left: 236/@rem;
            box-sizing: border-box;
        }
        form{
            width: 100%;
            padding-bottom: 10/@rem;
            box-sizing: border-box;
            p{
                width: 420/@rem;
                margin: auto;
                font-size: 0;
                margin-bottom: 40/@rem;
                label{
                    display: inline-block;
                    width: 100/@rem;
                    font-size: 24/@rem;
                    line-height: 40/@rem;
                    color: #333333;
                }
                input[type="text"]{
                    width: 312/@rem;
                    height: 40/@rem;
                    line-height: 28/@rem;
                    border-radius: 0;
                    padding: 0 10/@rem;
                    box-sizing: border-box;
                    font-size: 24/@rem;
                    border: solid 1px #adadad;
                }
                input[type="radio"]{
                    display: inline-block;
                    vertical-align: top;
                    width: 28/@rem;
                    height: 28/@rem;
                    margin-top: 6/@rem;
                    line-height: 40/@rem;
                    font-size: 24/@rem;
                    margin-right: 20/@rem;
                    border-radius: 50%;
                }
                .sex{
                    font-size: 24/@rem;
                    line-height: 40/@rem;
                }
                .sex:first-of-type{
                    margin-right: 30/@rem;
                }
            }
            .editor_pw{
                width: 128/@rem;
                height: 34/@rem;
                line-height: 34/@rem;
                background-color: #1a95d4;
                font-size: 22/@rem;
                color: #fff;
                padding: 0/@rem 8/@rem 0 10/@rem;
                box-sizing: border-box;
                margin-left: 165/@rem;
                em{
                    float: right;
                    margin-top: 13/@rem;
                }
                .em_open{
                    border-left: 7/@rem solid transparent;
                    border-bottom: 7/@rem solid #fff;
                    border-right: 7/@rem solid transparent;
                }
                .em_close{
                    border-left: 7/@rem solid transparent;
                    border-top: 7/@rem solid #fff;
                    border-right: 7/@rem solid transparent;
                }
            }
            .pw_list{
                display: none;
                margin-left: 165/@rem;
                padding: 24/@rem 0;
                box-sizing: border-box;
                width: 465/@rem;
                background-color: #eeeeee;
                p{
                    margin-left: 0;
                }
                label{
                    width: auto;
                }
                input[type="password"]{
                    width: 312/@rem;
                    height: 40/@rem;
                    line-height: 28/@rem;
                    border-radius: 0;
                    padding: 0 10/@rem;
                    box-sizing: border-box;
                    font-size: 24/@rem;
                    border: solid 1px #adadad;
                }
                .last_input{
                    width: 288/@rem !important;
                }
                .pw_button{
                    margin-bottom: 0;
                    margin-left: 98/@rem;
                    em{
                        display: inline-block;
                        text-align: center;
                        margin-right: 46/@rem;
                        width: 90/@rem;
                        height: 34/@rem;
                        line-height: 34/@rem;
                        font-size: 24/@rem;
                        color: #fff;
                        background-color: #1a95d4;
                    }
                    em:last-of-type{
                        color: #333333;
                        background-color: #cdcdcd;
                    }
                }
            }
            .submit{
                margin: 32/@rem auto;
                width: 134/@rem;
                height: 40/@rem;
                line-height: 40/@rem;
                text-align: center;
                color: #fff;
                font-size: 24/@rem;
                background-color: #1a95d4;
            }
        }
    }
}
//我的图片
.me_images{
    article{
        position: relative;
        .top_img{
            height: 280/@rem;
        }
        .user_img{
            position: absolute;
            top: 172/@rem;
            left: 40/@rem;
            width: 175/@rem;
            height: 175/@rem;
            border: solid 1px #666666;
        }
        h1{
            font-size: 30/@rem;
            line-height: 108/@rem;
            height: 108/@rem;
            color: #333333;
            padding-left: 236/@rem;
            box-sizing: border-box;
        }
        .images_list{
            h2{
                margin: 10/@rem 0/@rem 28/@rem 40/@rem;
                height: 40/@rem;
                line-height: 40/@rem;
                font-size: 24/@rem;
                color: #333333;
                .time{
                    display: inline-block;
                    padding-left: 16/@rem;
                    box-sizing: border-box;
                    height: 100%;
                    width: 174/@rem;
                    background-image: url(../images/me_images.png);
                    background-size: cover;
                    color: #fff;
                }
            }
            ul{
                padding-left: 24/@rem;
                box-sizing: border-box;
                li{
                    float: left;
                    margin: 0 16/@rem 40/@rem 16/@rem;
                    box-sizing: border-box;
                    width: 200/@rem;
                    height: 180/@rem;
                    border: solid 10/@rem #fff;
                    box-shadow: 3px 3px 6px #888888;
                    img{
                        width: 100%;
                        height: 100%;
                    }
                }
            }
        }
    }
//  .big_image{
//      position: fixed;
//      top: 0;
//      left: 0;
//      width: 100%;
//      height: 100%;
//      z-index: 9999;
//      background-color: rgba(0,0,0,0.6);
//      img{
//          width: 514/@rem;
//          max-height: 774/@rem;
//          object-fit: cover;
//          height: auto;
//      }
//      .swiper-container{
//          margin-top: 342/@rem;
//          width: 580/@rem;
//      }
//      .swiper-wrapper{
//          width: 100%;
//      }
//      .swiper-slide{
//          background-color: #fff;
//          padding: 38/@rem 0 0 33/@rem;
//          box-sizing: border-box;
//          width: 100%;
//          font-size: 0;
//          position: relative;
//          p{
//              width: 514/@rem;
//              height: 80/@rem;
//              line-height: 80/@rem;
//              font-size: 24/@rem;
//              color: #333333;
//              text-align: center;
//              em{
//                  display: inline-block;
//                  vertical-align: middle;
//                  margin-right: 16/@rem;
//                  background-image: url(../images/me_images_dw.png);
//                  background-size: cover;
//                  width: 22/@rem;
//                  height: 26/@rem;
//              }
//          }
//          span{
//              display: block;
//              position: absolute;
//              right: 0;
//              top: 0;
//              background-image: url(../images/me_images_close.png);
//              background-size: cover;
//              width: 37/@rem;
//              height: 37/@rem;
//          }
//      }
//      .swiper-button-prev{
//          z-index: 10000;
//          width: 52/@rem;
//          height: 107/@rem;
//          left: 32/@rem;
//          margin-top: -53/@rem;
//          background-image: url(../images/me_images_left.png);
//          background-size: cover;
//      }
//      .swiper-button-next{
//          z-index: 10000;
//          width: 52/@rem;
//          height: 107/@rem;
//          right: 32/@rem;
//          margin-top: -53/@rem;
//          background-image: url(../images/me_images_right.png);
//          background-size: cover;
//      }
//  }
    .big_image{
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 9999;
        background-color: #000;
        img{
            width:100%;
        }
        .swiper-container{
            width: 10rem;
            height: 16.08rem;
        }
        .swiper-pagination-bullet {
            background-color: #000;
            opacity: 0.2;
        }
         .swiper-pagination-bullet-active {
            background-color: #007aff;
        }
        .swiper-slide{
            margin: auto;
        }
        .bigimages_bottom{
            display: none;
            width: 100%;
            position: absolute;
            bottom: 0;
            z-index: 10000;
            height: 80/@rem;
            line-height: 80/@rem;
            font-size: 24/@rem;
            color: #fff;
            text-align: center;
            background-color: #666666;
            em{
                display: inline-block;
                vertical-align: middle;
                margin-right: 16/@rem;
                background-image: url(../images/me_images_dw.png);
                background-size: cover;
                width: 26/@rem;
                height: 26/@rem;
            }
        }
        .bigimages_top{
            display: none;
            width: 100%;
            position: absolute;
            top: 0;
            z-index: 10000;
            height: 80/@rem;
            line-height: 80/@rem;
            em{
                display: inline-block;
                float: right;
                width: 60/@rem;
                height: 60/@rem;
                padding-right: 20/@rem;
                padding-top: 20/@rem;
                background: url(../images/close.png) no-repeat center center;
                background-size: 50/@rem;
            }
        }
        .dw_alert{
            display: none;
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: 10001;
            margin-left: -100/@rem;
            margin-top: -100/@rem;
            width: 250/@rem;
            height: 230/@rem;
            border-radius: 10/@rem;
            font-size: 24/@rem;
            color: #fff;
            padding-top: 140/@rem;
            box-sizing: border-box;
            text-align: center;
            background: url(../images/dw_2.png) no-repeat center 50/@rem #666666;
            background-size: 60/@rem;
        }
    }
}
